<template>
	<view class="btns" v-if="show">
		<block v-if="info.status === 0">
			<view class="btn white" @tap="cancelTap(1)">取消订单</view>
			<view class="btn" @tap="payJump">确认支付</view>
		</block>
		<view v-if="info.status === 1" class="btn white" @tap="cancelTap(1)">申请退款</view>
		<view v-if="pShow" class="btn" @tap="replaceItem">切换项目</view>
		<view v-if="info.status === 5" class="btn" @tap="bellAdd">加钟</view>
		<view v-if="info.status === 6" class="btn" @tap="confirm">确认完成</view>
		<view v-if="info.status === 7" class="btn" @tap="appraise">去评价</view>
	</view>
</template>

<script>
var vk = uni.vk // vk依赖

export default {
	props: {
		info: {
			type: Object,
			default() {
				return {}
			}
		}
	},
	data() {
		return {
			arr: [3, 4],
			arr2: [8, 9],
			arr3: [1, 2, 3, 4]
		}
	},
	computed: {
		show() {
			let s = this.info.status
			let c = this.info.cancel_query
			return this.arr2.indexOf(s) === -1 && c !== 1
		},
		cShow() {
			let s = this.info.status
			return this.arr.indexOf(s) !== -1
		},
		pShow() {
			let s = this.info.status
			return this.arr3.indexOf(s) !== -1
		}
	},
	methods: {
		cancelTap(type) {
			if (this.info.cancel_query === 1) {
				return vk.toast("申请取消中")
			}
			this.$emit("cancel", type)
		},
		confirm() {
			this.$emit("confirm")
			vk.setStorageSync("fresh", 1)
		},
		appraise() {
			this.$emit("appraise")
			vk.setStorageSync("fresh", 1)
		},
		payJump() {
			vk.navigateTo(`/pages/project/order-pay?id=${this.info._id}`)
			vk.setStorageSync("fresh", 1)
		},
		replaceItem() {
			vk.navigateTo(`/pages/order/replace?id=${this.info._id}`)
			vk.setStorageSync("fresh", 1)
		},
		bellAdd() {
			vk.navigateTo(`/pages/order/bells?id=${this.info._id}`)
			vk.setStorageSync("fresh", 1)
		}
	}
}
</script>

<style lang="scss" scoped>
.btns {
	background-color: #fff;
	box-shadow: 0 -6rpx 20rpx rgba(0, 0, 0, 0.06);
	position: fixed;
	bottom: 0;
	left: 0;
	right: 0;
	padding: 20rpx 10rpx;
	display: flex;
	align-items: center;
	.btn {
		height: 80rpx;
		margin: 0 10rpx;
		flex: 1;
		border: 2rpx solid #24C388;
		color: #fff;
		background-color: #24C388;
		border-radius: 40rpx;
		text-align: center;
		line-height: 80rpx;
	}
	.white {
		color: #24C388;
		background-color: #fff;
	}
}
</style>
